<template>
	<view class="about_us_warp">
		<Header leftPathType="switchTab" leftPath="/pages/mine/mine" :title="$t('mine.about.us.title')"/>
		<view class="about_us_content">
			<view class="_content_item" v-for="item in list" :key="item.id" @click="jumpInfo(item)">
				<view class="_content_item_left">
					<up-image :src="item.src" width="16" height="16" bgColor="#f1f6ff00"></up-image>
					<view class="_content_item_title">{{item.name}}</view>
				</view>
				
				<!-- 版本更新 -->
				<view v-if="item.id === 6">
					<view class="version_item_" v-if="isNewVersion">
						<view v-if="isNewVersion" class="check_version_msg">{{$t("mine.about.us.check.title")}}</view>
						<up-image src="/static/common/right.png" width="16" height="16" bgColor="#f1f6ff00" />
					</view>
					<view class="version_item_" v-else>
						<view class="title_">{{$t('mine.about.us.check.current')}}</view>
						<view class="value_">v{{localAppVersonName}}.{{localAppVerson}}</view>
					</view>
				</view>
				
				<up-image v-else src="/static/comm/right_2.png" width="16" height="16" bgColor="#f1f6ff00"></up-image>
			</view>
		</view>
		<!-- 强制更新 -->
		<up-modal :show="forcedUpdateShow" :showConfirmButton = "false">
			<view class="slot-content">
				<!-- <view class="close_warp" @click="forcedUpdateShow=false;">
					<up-image src="/static/comm/close.png" width="20" height="20" bgColor="#f1f6ff00"></up-image>
				</view> -->
				<view class="content_0">
					<up-image src="/static/comm/update.png" width="180" height="142" bgColor="#f1f6ff00"></up-image>
				</view>
				<view class="content_">
					<view class="content_1">{{$t('common.update.title')}}</view>
					<view class="update_version">V{{updateApkObj.versionName}}</view>
					<view class="update_content">{{$t("common.update.content.title")}}：</view>
					<view class="update_content_info">{{updateApkObj.content}}</view>
				</view>
				<view class="but_" v-if="!bannerPercentageShow">
					<view class="but_copy" @click="goUpdate(updateApkObj,platformType)">{{$t('common.update.but.promptly')}}</view>
					<view @click="forcedUpdateShow = false;" class="but_close" v-if="!updateApkObj.isForce">{{$t('common.update.but.no.promptly')}}</view>
				</view>
				<view class="but_" v-else>
					<up-line-progress :percentage="bannerPercentage" activeColor="#265FFF"></up-line-progress>
					<view class="banner_loading_msg">
						{{$t('common.update.ing')}}{{bannerPercentage}}%
					</view>
				</view>
			</view>
		</up-modal>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
	import Header from '@/components/header_comm2.vue';
	import { comparisonVersionHandler } from '@/utils/index.js';
	import { checkAppVersion } from '@/api/common.js';
	import dayjs from 'dayjs';
	
	export default {
		components:{Header},
		
		data() {
			return {
				list:[
					{
						id:1,
						name:this.$t('mine.about.us.company'),
						src:"/static/aboutUs/icon_jymm.png",
						path:"/pages/about_us_company_profile/about_us_company_profile"
					},{
						id:2,
						name:this.$t('mine.about.us.service'),
						src:"/static/aboutUs/icon_xx.png",
						path:"/pages/about_us_service_agreement/about_us_service_agreement?backPath=aboutUs"
					},{
						id:3,
						name:this.$t('mine.about.us.privacy'),
						src:"/static/aboutUs/icon_ysxy.png",
						path:"/pages/about_us_privacy_agreement/about_us_privacy_agreement?backPath=aboutUs"
					},{
						id:4,
						name:this.$t('mine.about.us.user'),
						src:"/static/aboutUs/icon_dyhxy.png",
						path:"/pages/about_us_user_agreement/about_us_user_agreement?backPath=aboutUs"
					},{
						id:5,
						name:this.$t('mine.about.us.registration'),
						src:"/static/aboutUs/icon_zcxy.png",
						path:"/pages/about_us_registration_agreement/about_us_registration_agreement"
					},{
						id:6,
						name:this.$t('mine.about.us.company'),
						src:"/static/aboutUs/icon_dlmm.png",
					},
				],
				forcedUpdateShow:false,
				localAppVersonName:null,
				localAppVerson:null,
				isNewVersion:false,// 是否需要跟新
				platformType:null,// 当前版本号
				updateApkObj: {} ,// 后台数据
				bannerPercentageShow:false,
				bannerPercentage:0,// 进度条
			};
		},
		onShow() {
			const localAppVersonName = uni.getStorageSync('version');
			if(localAppVersonName){
				this.localAppVersonName = localAppVersonName;
			}
			const localAppVerson = uni.getStorageSync('versionCode');
			if(localAppVerson){
				this.localAppVerson = localAppVerson;
			}
			// 获取设备是安卓还是ios
			const appUpdate = uni.getStorageSync('platform');
			// #ifdef APP-PLUS
			　　this.platformType = appUpdate == 'android' ? 'ANDROID' : 'IOS';
			　　this.checkVersion();  // 判断是否需要更新
			// #endif  
		},
		methods: {
			jumpInfo(item) {
				if(item && item.path){
					uni.navigateTo({
						url:item.path,
					})
				}else if(item.id === 6){// 检查更新
					this.getNewVersion();
				}
			},
			/**
			 * 检查最新的版本
			 */
			async checkVersion(){
				const params={
					terminal: this.platformType,
					versionCode:this.localAppVerson,
				}
				const res = await checkAppVersion(params)
				if(res && res.bizcode === 100){
					const data = res.data || {};
					if(data && Object.keys(data).length!==0 && comparisonVersionHandler(this.localAppVerson,data.versionCode)){
						this.isNewVersion = true;
					}
					this.updateApkObj = data;
				}
			},
			
			async getNewVersion(){
				const params={
					terminal: this.platformType,
					versionCode:this.localAppVerson,
				}
				const res = await checkAppVersion(params)
				if(res && res.bizcode === 100){
					const data = res.data || {};
					if(data && Object.keys(data).length!==0 && comparisonVersionHandler(this.localAppVerson,data.versionCode)){
						this.updateApkObj = data;
						this.isNewVersion = true;
						this.forcedUpdateShow = true;  // 显示弹窗
					}else{
						this.$refs.uToastRef.show({
							type: 'sesses',
							message: this.$t('mine.about.us.check.current.new'),
						});
					}
				}
			},
			// 安装
			goUpdate(updateApkObj,platformType) {
				const self = this;
				if (platformType == 'ANDROID') {
					// 弹出系统等待对话框
					var dtask = plus.downloader.createDownload(updateApkObj.downloadUrl, {}, function(d, status) {
						// 下载完成
						if (status == 200) {
							plus.runtime.install(plus.io.convertLocalFileSystemURL(d.filename), {force: true}, function(resp){
								// 直接重启APP
								uni.setStorageSync('versionUpdateTime', dayjs().valueOf()); // 记录升级的时间
								plus.runtime.restart();
							}, function(error) {
								console.log("error",error);
								uni.showToast({
									title: error.message,
									mask: false,
									duration: 1500
								});
							});
						} else {
							self.bannerPercentageShow = false;
							uni.showToast({
								title: this.$t('common.update.error'),
								mask: false,
								duration: 1500
							});
						}
					});
					try {
						dtask.start(); // 开启下载的任务
						let prg = 0;
						this.bannerPercentageShow = true;
						dtask.addEventListener('statechanged', function(task, status) {
							// 给下载任务设置一个监听 并根据状态  做操作
							switch (task.state) {
								case 1:
									break;
								case 2:
									break;
								case 3:
									prg = parseInt((parseFloat(task.downloadedSize) / parseFloat(task.totalSize)) * 100);
									self.bannerPercentage = prg;
									break;
								case 4:
									plus.nativeUI.closeWaiting();
									self.forcedUpdateShow = false;  // 显示弹窗
									break;
							}
						});
					} catch (err) {
						console.log("更新失败-03err",err);
						plus.nativeUI.closeWaiting();
						uni.showToast({
							title: this.$t('common.update.error')+'-03',
							mask: false,
							duration: 1500
						});
					}
				} else if (platformType == 'IOS') {  // ios跳转到app store
					plus.runtime.openURL(updateApkObj.downloadUrl);
				}
			},
		}
	}
</script>

<style lang="scss">
.about_us_warp{
	height: calc(100vh - 0rpx);
	.about_us_content{
		padding: 30rpx;
	}
	._content_item{
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1rpx solid #E8E8E8;
		padding: 40rpx 0;
		._content_item_left{
			display: flex;
			align-items: center;
		}
		._content_item_title{
			margin-left: 10rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #222222;
		}
		.version_item_{
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 28rpx;
		}
	}
}
</style>
